<template>
  <div class="order-item">
    <div class="order-item-body" v-for="item in itemList">
      <div style="flex: 1"><img
        :src="item.imgurl"
        width="80px"></div>
      <div style="flex: 4" class="order-item-body-right">
        <div style="flex: 1"><p>{{item.productName}}</p></div>
        <div style="flex: 1"><p>
          {{item.totalPrice}}元 × {{item.quantity}}</p></div>

      </div>

    </div>
  </div>
</template>

<script>
  export default {
    name: "orderDetial-item",
    props:{
      itemList:{
        type:Array,
        default:()=>{}
      }
    },
    data(){
      return{

      }
    }
  }
</script>

<style scoped>

  .order-item {
    border-bottom: 1px solid #e0e0e0;

  }

  .order-item-body {
    display: flex;
    height: 80px;
    padding-left: 20px;
    margin: 10px 0px;
  }

  .order-item-body-right {

    display: flex;
  }
  .order-item-body-right{
   line-height: 80px;
  }

</style>
